<!--
 * @Description: 
 * @Autor: 商晓彬
 * @Date: 2021-08-20 13:57:03
 * @LastEditors: 商晓彬
 * @LastEditTime: 2022-02-16 16:32:49
-->

<div class="warehousing">
    <div class="m-subheader">
        <div class="row align-items-center">
            <div class="mr-auto col-auto">
                <h3 class="m-subheader__title m-subheader__title--separator">
                    <span>库存信息</span>
                </h3>
            </div>
        </div>
    </div>
    <div class="m-content">
        <div class="m-portlet m-portlet--mobile">
            <div class="m-portlet__body">
                <div class="p-formgroup-inline">
                    <span class="p-field">
                        <span class="input-lable">仓库名称：</span>
                        <p-dropdown filter="true" name="stroeName" [options]="stroeNameOptions" placeholder="请选择仓库名称"
                            [(ngModel)]="stroeName" emptyFilterMessage="暂无数据">
                            <ng-template let-item pTemplate="selectedItem">
                                <span *ngIf="stroeName !=  undefind "
                                    style="vertical-align:middle; margin-left: .5em;width: 147px;">{{item.label}}</span>
                                <span *ngIf="stroeName ==  undefind "
                                    style="vertical-align:middle; margin-left: .5em;width: 147px;"> </span>
                            </ng-template>
                            <ng-template let-model pTemplate="item">
                                <div class="ui-helper-clearfix" style="position: relative;height: 25px;">
                                    <div style="font-size:14px;float:right;margin-top:4px;width: 147px;">{{model.label}}
                                    </div>
                                </div>
                            </ng-template>
                        </p-dropdown>
                    </span>
                    <span class="p-field ml">
                        <span class="input-lable">产品图号：</span>
                        <p-dropdown filter="true" name="productDrawingNo" [options]="drawingNoOptions"
                            placeholder="请选择产品图号" [(ngModel)]="productDrawingNo" emptyFilterMessage="暂无数据"
                            (onChange)="getProductNameDropListEv($event)">
                            <ng-template let-item pTemplate="selectedItem">
                                <span *ngIf="productDrawingNo !=  undefind "
                                    style="vertical-align:middle; margin-left: .5em;width: 147px;">{{item.label}}</span>
                                <span *ngIf="productDrawingNo ==  undefind "
                                    style="vertical-align:middle; margin-left: .5em;width: 147px;"> </span>
                            </ng-template>
                            <ng-template let-model pTemplate="item">
                                <div class="ui-helper-clearfix" style="position: relative;height: 25px;">
                                    <div style="font-size:14px;float:right;margin-top:4px;width: 147px;">{{model.label}}
                                    </div>
                                </div>
                            </ng-template>
                        </p-dropdown>
                    </span>
                    <span class="p-field ml">
                        <span class="input-lable">产品名称：</span>
                        <p-dropdown filter="true" name="productName" [options]="productNameOptions"
                            placeholder="请选择产品名称" [(ngModel)]="productName" emptyFilterMessage="暂无数据">
                            <ng-template let-item pTemplate="selectedItem">
                                <span *ngIf="productName !=  undefind "
                                    style="vertical-align:middle; margin-left: .5em;width: 147px;">{{item.label}}</span>
                                <span *ngIf="productName ==  undefind "
                                    style="vertical-align:middle; margin-left: .5em;width: 147px;"> </span>
                            </ng-template>
                            <ng-template let-model pTemplate="item">
                                <div class="ui-helper-clearfix" style="position: relative;height: 25px;">
                                    <div style="font-size:14px;float:right;margin-top:4px;width: 147px;">{{model.label}}
                                    </div>
                                </div>
                            </ng-template>
                        </p-dropdown>
                    </span>
                    <span class="p-field ml">
                        <span class="input-lable">规格：</span>
                        <p-dropdown filter="true" name="module" [options]="moduleOptions" placeholder="请选择规格"
                            [(ngModel)]="module" emptyFilterMessage="暂无数据">
                            <ng-template let-item pTemplate="selectedItem">
                                <span *ngIf="module !=  undefind "
                                    style="vertical-align:middle; margin-left: .5em;width: 147px;">{{item.label}}</span>
                                <span *ngIf="module ==  undefind "
                                    style="vertical-align:middle; margin-left: .5em;width: 147px;"> </span>
                            </ng-template>
                            <ng-template let-model pTemplate="item">
                                <div class="ui-helper-clearfix" style="position: relative;height: 25px;">
                                    <div style="font-size:14px;float:right;margin-top:4px;width: 147px;">{{model.label}}
                                    </div>
                                </div>
                            </ng-template>
                        </p-dropdown>
                    </span>
                    <span class="p-field ml">
                        <span class="input-lable">物料类别：</span>
                        <p-dropdown filter="true" name="materialsType" [options]="materialsNodeOptions"
                            placeholder="请选择物料类别" [(ngModel)]="materialsType" emptyFilterMessage="暂无数据"
                            (onChange)="onChange($event)">
                            <ng-template let-item pTemplate="selectedItem">
                                <span *ngIf="materialsType !=  undefind "
                                    style="vertical-align:middle; margin-left: .5em;width: 147px;">{{item.label}}</span>
                                <span *ngIf="materialsType ==  undefind "
                                    style="vertical-align:middle; margin-left: .5em;width: 147px;"> </span>
                            </ng-template>
                            <ng-template let-model pTemplate="item">
                                <div class="ui-helper-clearfix" style="position: relative;height: 25px;">
                                    <div style="font-size:14px;float:right;margin-top:4px;width: 147px;">{{model.label}}
                                    </div>
                                </div>
                            </ng-template>
                        </p-dropdown>
                    </span>
                    <span class="p-field ml">
                        <span class="input-lable">物料细类：</span>
                        <p-dropdown filter="true" name="materialsNode" [options]="materialsTypeOptions"
                            placeholder="请选择物料细类" [(ngModel)]="materialsNode" emptyFilterMessage="暂无数据">
                            <ng-template let-item pTemplate="selectedItem">
                                <span *ngIf="materialsNode !=  undefind "
                                    style="vertical-align:middle; margin-left: .5em;width: 147px;">{{item.label}}</span>
                                <span *ngIf="materialsNode ==  undefind "
                                    style="vertical-align:middle; margin-left: .5em;width: 147px;"> </span>
                            </ng-template>
                            <ng-template let-model pTemplate="item">
                                <div class="ui-helper-clearfix" style="position: relative;height: 25px;">
                                    <div style="font-size:14px;float:right;margin-top:4px;width: 147px;">{{model.label}}
                                    </div>
                                </div>
                            </ng-template>
                        </p-dropdown>
                    </span>
                </div>
                <div class="p-formgroup-inline" style="margin-top: 10px;">
                    <span class="p-field">
                        <span class="input-lable">合格证号：</span>
                        <p-dropdown filter="true" name="qualifiedNumber" [options]="qualifiedNumberOptions"
                            placeholder="请选择合格证号" [(ngModel)]="qualifiedNumber" emptyFilterMessage="暂无数据">
                            <ng-template let-item pTemplate="selectedItem">
                                <span *ngIf="qualifiedNumber !=  undefind "
                                    style="vertical-align:middle; margin-left: .5em;width: 147px;">{{item.label}}</span>
                                <span *ngIf="qualifiedNumber ==  undefind "
                                    style="vertical-align:middle; margin-left: .5em;width: 147px;"> </span>
                            </ng-template>
                            <ng-template let-model pTemplate="item">
                                <div class="ui-helper-clearfix" style="position: relative;height: 25px;">
                                    <div style="font-size:14px;float:right;margin-top:4px;width: 147px;">{{model.label}}
                                    </div>
                                </div>
                            </ng-template>
                        </p-dropdown>
                    </span>
                    <span class="p-field ml">
                        <span class="input-lable">放行单号：</span>
                        <p-dropdown filter="true" name="releaseOrder" [options]="releaseOrderOptions"
                            placeholder="请选择放行单号" [(ngModel)]="releaseOrder" emptyFilterMessage="暂无数据">
                            <ng-template let-item pTemplate="selectedItem">
                                <span *ngIf="releaseOrder !=  undefind "
                                    style="vertical-align:middle; margin-left: .5em;width: 147px;">{{item.label}}</span>
                                <span *ngIf="releaseOrder ==  undefind "
                                    style="vertical-align:middle; margin-left: .5em;width: 147px;"> </span>
                            </ng-template>
                            <ng-template let-model pTemplate="item">
                                <div class="ui-helper-clearfix" style="position: relative;height: 25px;">
                                    <div style="font-size:14px;float:right;margin-top:4px;width: 147px;">{{model.label}}
                                    </div>
                                </div>
                            </ng-template>
                        </p-dropdown>
                    </span>
                    <span class="p-field ml">
                        <span class="input-lable" style="margin-right: 27px;">型号：</span>
                        <p-dropdown filter="true" name="productCode" [options]="productCodeOptions" placeholder="请选择型号"
                            [(ngModel)]="productCode" emptyFilterMessage="暂无数据" (onChange)="getSendTime($event)">
                            <ng-template let-item pTemplate="selectedItem">
                                <span *ngIf="productCode !=  undefind "
                                    style="vertical-align:middle; margin-left: .5em;width: 147px;">{{item.label}}</span>
                                <span *ngIf="productCode ==  undefind "
                                    style="vertical-align:middle; margin-left: .5em;width: 147px;"> </span>
                            </ng-template>
                            <ng-template let-model pTemplate="item">
                                <div class="ui-helper-clearfix" style="position: relative;height: 25px;">
                                    <div style="font-size:14px;float:right;margin-top:4px;width: 147px;">{{model.label}}
                                    </div>
                                </div>
                            </ng-template>
                        </p-dropdown>
                    </span>
                    <span class="p-field ml">
                        <span class="input-lable">发次：</span>
                        <p-dropdown filter="true" name="sendTime" [options]="sendTimeOptions" placeholder="请选择发次"
                            [(ngModel)]="sendTime" emptyFilterMessage="暂无数据">
                            <ng-template let-item pTemplate="selectedItem">
                                <span *ngIf="sendTime !=  undefind "
                                    style="vertical-align:middle; margin-left: .5em;width: 147px;">{{item.label}}</span>
                                <span *ngIf="sendTime ==  undefind "
                                    style="vertical-align:middle; margin-left: .5em;width: 147px;"> </span>
                            </ng-template>
                            <ng-template let-model pTemplate="item">
                                <div class="ui-helper-clearfix" style="position: relative;height: 25px;">
                                    <div style="font-size:14px;float:right;margin-top:4px;width: 147px;">{{model.label}}
                                    </div>
                                </div>
                            </ng-template>
                        </p-dropdown>
                    </span>
                    <span class="p-field ml">
                        <span class="input-lable">物料属性：</span>
                        <p-dropdown filter="true" name="materialsAttribute" [options]="materialsAttributeOptions"
                            placeholder="请选择物料属性" [(ngModel)]="materialsAttribute" emptyFilterMessage="暂无数据">
                            <ng-template let-item pTemplate="selectedItem">
                                <span *ngIf="materialsAttribute !=  undefind "
                                    style="vertical-align:middle; margin-left: .5em;width: 147px;">{{item.label}}</span>
                                <span *ngIf="materialsAttribute ==  undefind "
                                    style="vertical-align:middle; margin-left: .5em;width: 147px;"> </span>
                            </ng-template>
                            <ng-template let-model pTemplate="item">
                                <div class="ui-helper-clearfix" style="position: relative;height: 25px;">
                                    <div style="font-size:14px;float:right;margin-top:4px;width: 147px;">{{model.label}}
                                    </div>
                                </div>
                            </ng-template>
                        </p-dropdown>
                    </span>
                    <p-button label="查询" (onClick)="getTableList()" class="ml"></p-button>
                    <p-button label="重置" (onClick)="reset()" class="ml"></p-button>
                </div>
                <div class="p-formgroup-inline" style="margin-top: 10px;">
                    <p-button *ngIf="'Pages.InventoryInformation.SupplementaryCertificate' | permission" label="补录合格证" (onClick)="add()" class="ml"></p-button>
                    <p-button *ngIf="'Pages.InventoryInformation.ConsumablesInventory' | permission" label="耗材库存" (onClick)="openUrl()" class="ml"></p-button>
                </div>
                <div class="row align-items-center" style="margin-top: 25px;">
                    <div class="primeng-datatable-container">
                        <p-table #dataTable [value]="primengTableHelper.records" (onLazyLoad)="getTableList($event)"
                            rows="{{primengTableHelper.defaultRecordsCountPerPage}}" [paginator]="false" [lazy]="true"
                            [scrollable]="true" ScrollWidth="100%" [responsive]="primengTableHelper.isResponsive"
                            [resizableColumns]="primengTableHelper.resizableColumns">
                            <ng-template pTemplate="header">
                                <tr>
                                    <th style="width: 150px">操作</th>
                                    <th style="width: 50px">序号</th>
                                    <th style="width: 150px">仓库名称</th>
                                    <th style="width: 150px">储位</th>
                                    <th style="width: 150px">合格证号</th>
                                    <th style="width: 150px">放行单号</th>
                                    <th style="width: 150px">产品图号</th>
                                    <th style="width: 150px">产品名称</th>
                                    <th style="width: 150px">规格</th>
                                    <th style="width: 150px">库存数量</th>
                                    <th style="width: 150px">自由库存数量</th>
                                    <th style="width: 150px">可用预配套数量</th>
                                    <th style="width: 150px">配套数量</th>
                                    <th style="width: 150px">物料类别</th>
                                    <th style="width: 150px">物料细类</th>
                                    <th style="width: 150px">物料属性</th>
                                    <th style="width: 150px">质控卡号</th>
                                    <th style="width: 150px">适用型号(产品代号)</th>
                                    <th style="width: 150px">适用发次</th>
                                    <th style="width: 150px">批次</th>
                                    <th style="width: 150px">转批次</th>
                                    <th style="width: 150px">合格证任务号</th>
                                    <th style="width: 150px">装配任务号</th>
                                    <th style="width: 550px;text-align: center;">产品编号(件号)</th>
                                    <th style="width: 170px">有效期止</th>
                                    <th style="width: 350px;text-align: center;">特殊记载</th>
                                    <th style="width: 150px">隔离单号</th>
                                    <th style="width: 150px">隔离原因</th>
                                    <th style="width: 150px">隔离人员</th>
                                    <th style="width: 170px">隔离时间</th>
                                    <th style="width: 150px">入库人</th>
                                    <th style="width: 170px">入库时间</th>
                                    <th style="width: 150px">仓库确认人</th>
                                    <th style="width: 170px">仓库确认时间</th>
                                </tr>
                            </ng-template>
                            <ng-template pTemplate="body" let-record="$implicit" let-rowIndex="rowIndex">
                                <tr>
                                    <td style="width: 150px">
                                        <div class="btn-group dropdown" dropdown container="body">
                                            <button dropdownToggle class="dropdown-toggle btn btn-sm btn-primary">
                                                <i class="fa fa-cog"></i><span class="caret"></span> 操作
                                            </button>
                                            <ul class="dropdown-menu" *dropdownMenu>
                                                <li>
                                                    <a *ngIf="'Pages.InventoryInformation.Resume' | permission" href="javascript:;" (click)="lookResume(record)">履历</a>
                                                </li>
                                                <li>
                                                    <a *ngIf="'Pages.InventoryInformation.Modify' | permission" href="javascript:;" (click)="update(record,'修改')">修改</a>
                                                </li>
                                                <li>
                                                    <a *ngIf="'Pages.InventoryInformation.See' | permission" href="javascript:;" (click)="watch(record,'查看')">查看</a>
                                                </li>
                                                <li>
                                                    <a *ngIf="'Pages.InventoryInformation.SupportingView' | permission" href="javascript:;" (click)="ptWatch(record)">配套去向查看</a>
                                                </li>
                                                <li
                                                    *ngIf="record.materialsProperty == 0 || record.materialsProperty == 4">
                                                    <a *ngIf="'Pages.InventoryInformation.ProductIsolation' | permission" href="javascript:;" (click)="ex(record,'查看')">产品隔离</a>
                                                </li>
                                            </ul>
                                        </div>
                                    </td>
                                    <td style="width: 50px">{{rowIndex+1}}</td>
                                    <td style="width: 150px">{{record.stroeName}}</td>
                                    <td style="width: 150px">{{record.binLocation}}</td>
                                    <td style="width: 150px">{{record.qualifiedNumber}}</td>
                                    <td style="width: 150px">{{record.releaseOrder}}</td>
                                    <td style="width: 150px">{{record.productDrawingNo}}</td>
                                    <td style="width: 150px">{{record.productName}}</td>
                                    <td style="width: 150px">{{record.module}}</td>
                                    <td style="width: 150px">{{record.storeQuality}}</td>
                                    <td style="width: 150px">{{record.freeStoreQuality}}</td>
                                    <td style="width: 150px">{{record.usableQuantityStock}}</td>
                                    <td style="width: 150px">{{record.suiteStock}}</td>
                                   
                                    <td style="width: 150px">{{record.materialsNode}}</td>
                                    <td style="width: 150px">{{record.materialCategory}}</td>
                                    <td style="width: 150px">{{enum(record.materialsProperty)}}</td>
                                    <td style="width: 150px">{{record.qCCardNo}}</td>
                                    <td style="width: 150px">{{record.productCodeName}}</td>
                                    <td style="width: 150px">{{record.sendTimeName}}</td>
                                    <td style="width: 150px">{{record.batch}}</td>
                                    <td style="width: 150px">{{record.turnBatch}}</td>
                                    <td style="width: 150px">{{record.qualifiedTaskNumber}}</td>
                                    <td style="width: 150px">{{record.assemblyTaskNumber}}</td>
                                    <td style="width: 550px">{{record.productNumberShow}}</td>
                                    <td style="width: 170px">{{record.expirationDate | momentFormat:'YYYY-MM-DD '}}</td>
                                    <td style="width: 350px">{{record.specialRecords}}</td>
                                    <td style="width: 150px">{{record.isolationCode}}</td>
                                    <td style="width: 150px">{{record.isolationReason}}</td>
                                    <td style="width: 150px">{{record.isolationUser}}</td>
                                    <td style="width: 170px">{{record.isolationTime | momentFormat:'YYYY-MM-DD
                                        HH:mm:ss'}}</td>
                                    <td style="width: 150px">{{record.storePutPeople}}</td>
                                    <td style="width: 170px">{{record.storePutTime | momentFormat:'YYYY-MM-DD
                                        HH:mm:ss'}}</td>
                                    <td style="width: 150px">{{record.identifyingPeople}}</td>
                                    <td style="width: 170px">{{record.identifyingTime | momentFormat:'YYYY-MM-DD
                                        HH:mm:ss'}}</td>
                                </tr>
                            </ng-template>
                        </p-table>
                        <div class="primeng-paging-container">
                            <p-paginator [rows]="primengTableHelper.defaultRecordsCountPerPage" #paginator
                                (onPageChange)="getTableList($event)"
                                [totalRecords]="primengTableHelper.totalRecordsCount"
                                [rowsPerPageOptions]="primengTableHelper.predefinedRecordsCountPerPage">
                            </p-paginator>
                            <span class="total-records-count">
                                {{'TotalRecordsCount' | localize:primengTableHelper.totalRecordsCount}}
                            </span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- 配套去向 -->
    <app-matching-watch #MatchingWatchComponent [parentInfo]="rowdata"></app-matching-watch>
    <!-- 履历 -->
    <app-add-show-resume #AddShowResumeComponent [parentInfo]="rowdata"></app-add-show-resume>
    <!-- 补录合格证 -->
    <app-supplementary-certificate #SupplementaryCertificateComponent (modalSave)="getTableList()">
    </app-supplementary-certificate>
    <!-- 合格证修改与隔离 -->
    <app-certificate-msg #CertificateMsgComponent [typeStatus]="typeStatus" [title]="title" (modalSave)="getTableList()"
        [editData]="rowdata">
    </app-certificate-msg>
    <!-- 放行单 -->
    <app-release-msg #ReleaseMsgComponent [typeStatus]="typeStatus" [title]="title" (modalSave)="getTableList()"
        [editData]="rowdata">
    </app-release-msg>
    <!-- 合格证手动 -->
    <app-manual-msg #ManualMsgComponent [typeStatus]="typeStatus" [title]="title" (modalSave)="getTableList()"
        [editData]="rowdata">
    </app-manual-msg>
</div>